<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="时间节点(天)" prop="surveyStartTime" label-width="112px">
        <div class="block">
          <el-date-picker
              v-model="valuetime4"
              type="Date"
              placeholder="请选择时间"
          />
        </div>
      </el-form-item>
      <el-form-item label="时间节点(月)" prop="surveyStartTime" label-width="112px">
        <div class="block">
          <el-date-picker
              v-model="valuetime2"
              type="month"
              placeholder="请选择时间"
          />
        </div>
      </el-form-item>
      <el-form-item label="时间节点(范围)" prop="surveyStartTime" label-width="112px">
        <el-date-picker
            v-model="value1"
            type="datetimerange"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
            :default-time="defaultTime2"
        />
      </el-form-item>
    </el-form>
    <el-row type="flex" justify="end">
      <el-col :span="18">
        <!-- Your content here -->
      </el-col>
      <el-col :span="6" style="text-align: right">
        <el-statistic title="总计" :value="outputValue" />
      </el-col>
    </el-row>
    <el-table v-loading="loading" :data="surveyLogList" :default-sort="defaultSort" @sort-change="handleSortChange" border >
      <el-table-column label="调查人" align="center" prop="surveyUserName" />
      <el-table-column v-if="valuetime4" label="当日" align="center" prop="surveyUserPrice" />
      <el-table-column v-if="valuetime2" label="本月" align="center" prop="surveyUserPrice" />
      <el-table-column v-if="value1" label="范围" align="center" prop="surveyUserPrice" />
    </el-table>



    <pagination
        v-show="total>0"
        :total="total"
        v-model:page="queryParams.pageNum"
        v-model:limit="queryParams.pageSize"
        @pagination="getList"
    />

  </div>
</template>

<style scoped>
.el-button .custom-loading .circular {
  margin-right: 6px;
  width: 18px;
  height: 18px;
  animation: loading-rotate 2s linear infinite;
}
.el-button .custom-loading .circular .path {
  animation: loading-dash 1.5s ease-in-out infinite;
  stroke-dasharray: 90, 150;
  stroke-dashoffset: 0;
  stroke-width: 2;
  stroke: var(--el-button-text-color);
  stroke-linecap: round;
}
</style>


<script setup name="SurveyLog">
import {dayjs} from "element-plus";
let identification = 0;
import { useTransition } from '@vueuse/core'
const source = ref(0)
const outputValue = useTransition(source, {
  duration: 1500,
})
source.value = 0


const value1 = ref('')
const defaultTime2 = [new Date(2000, 1, 1, 18, 0, 0), new Date(2000, 2, 1, 12, 0, 0)];
const valuetime4 = ref('')
const valuetime2 = ref('')
import { checkRole } from "@/utils/permission.js"; // 权限判断函数
// 获取用户权限
import useUserStore from '@/store/modules/user.js'
const userid = useUserStore().id;
const usernames = useUserStore().name;
import {
  listSurveyLog,
  listSurveyLogByid
} from "@/api/survey/Financialjournal.js";
const { proxy } = getCurrentInstance();

const surveyLogList = ref([]);
const open = ref(false);
const loading = ref(true);
const showSearch = ref(true);
const ids = ref([]);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const title = ref("");

const data = reactive({
  form: {},
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    surveyUserPrice: null,
    surveyUserName:null,
    surveyStartTime: null,
    surveyStopTime: null,
  },
  rules: {
  }
});


const value = ref('')

const { queryParams, form, rules } = toRefs(data);
const hasAdminRole = checkRole(["admin"]); // 调用 checkRole 函数并传递包含 "admin" 的数组作为参数
/** 查询调查记录列表 */
function getList() {
  loading.value = true;
  if (hasAdminRole) { // 根据 hasAdminRole 的值执行相应操作
    listSurveyLog(queryParams.value,identification).then(response => {
      surveyLogList.value = response.rows;
      total.value = response.total;
      source.value = response.bigDecimal || 0;
      loading.value = false;
    });
  } else {
    // 用户没有管理员角色,可能需要执行其他操作
    listSurveyLogByid(userid,queryParams.value,identification).then(response => {
      surveyLogList.value = response.rows;
      total.value = response.total;
      source.value = response.bigDecimal || 0;
      loading.value = false;
    });
  }
}


function handleSortChange(column, prop, order) {
  queryParams.value.orderByColumn = column.prop;
  queryParams.value.isAsc = column.order;
  getList();
}

getList();

import { watch, ref } from 'vue';
import _ from 'lodash'; // 引入 lodash，确保已经安装
const debounceDelay = 500; // 防抖延迟时间，500毫秒
const fetchData = _.debounce(() => {
  if (valuetime4.value) {
    valuetime2.value = '';
    value1.value = '';
    const formattedValueTime4 = dayjs(valuetime4.value).format('YYYY-MM-DD HH:mm:ss');
    queryParams.value.surveyStartTime = formattedValueTime4;

    if (hasAdminRole) {
      listSurveyLog(queryParams.value,1).then(response => {
        surveyLogList.value = response.rows;
        total.value = response.total;
        source.value = response.bigDecimal;
        loading.value = false;
      });
    } else {
      listSurveyLogByid(userid, queryParams.value,1).then(response => {
        surveyLogList.value = response.rows;
        total.value = response.total;
        source.value = response.bigDecimal;
        loading.value = false;
      });
    }
  }
}, debounceDelay);
const fetchData2 = _.debounce(() => {
  if (valuetime2.value) {
    valuetime4.value = '';
    value1.value = '';
    loading.value = true;
    const formattedValueTime2 = dayjs(valuetime2.value).format('YYYY-MM-DD HH:mm:ss');
    queryParams.value.surveyStartTime = formattedValueTime2;
    if (hasAdminRole) { // 根据 hasAdminRole 的值执行相应操作
      listSurveyLog(queryParams.value,2).then(response => {
        surveyLogList.value = response.rows;
        total.value = response.total;
        source.value = response.bigDecimal;
        loading.value = false;
      });
    } else {
      // 用户没有管理员角色,可能需要执行其他操作
      listSurveyLogByid(userid,queryParams.value,2).then(response => {
        surveyLogList.value = response.rows;
        total.value = response.total;
        source.value = response.bigDecimal;
        loading.value = false;
      });
    }
  }
}, debounceDelay);
const fetchData3 = _.debounce(() => {
  if (value1.value && value1.value.length === 2 && value1.value[0] && value1.value[1]) { // 确保value1是一个有效的日期范围数组，并且两个日期都有值
    valuetime4.value = '';
    valuetime2.value = '';
    loading.value = true;
    const startTime = dayjs(value1.value[0]).format('YYYY-MM-DD HH:mm:ss');
    const endTime = dayjs(value1.value[1]).format('YYYY-MM-DD HH:mm:ss');
    queryParams.value.surveyStartTime = startTime; // 添加开始时间参数
    queryParams.value.surveyStopTime = endTime; // 添加结束时间参数
    if (hasAdminRole) { // 根据 hasAdminRole 的值执行相应操作
      listSurveyLog(queryParams.value, 3).then(response => {
        surveyLogList.value = response.rows;
        total.value = response.total;
        source.value = response.bigDecimal;
        loading.value = false;
      });
    } else {
      // 用户没有管理员角色,可能需要执行其他操作
      listSurveyLogByid(userid, queryParams.value, 3).then(response => {
        surveyLogList.value = response.rows;
        total.value = response.total;
        source.value = response.bigDecimal;
        loading.value = false;
      });
    }
  }
}, debounceDelay);
watch(valuetime4, () => {
  identification=1;
  fetchData(); // 使用防抖函数来处理数据获取
});
watch(valuetime2, () => {
  fetchData2(); // 使用防抖函数来处理数据获取
  identification=2;
});
watch(value1, () => {
  fetchData3(); // 使用防抖函数来处理数据获取
  identification=3;
});
</script>
